<template>
  <div class="updatepwd">
    <van-form @submit="onSubmit">
      <van-cell-group inset>
        <van-field
          v-model="password"
          :type="niswarning ? 'password' : 'text'"
          name="password"
          label="密码"
          :right-icon="niswarning ? 'closed-eye' : 'eye-o'"
          @click-right-icon="niswarning = !niswarning"
          placeholder="请填写原密码"
          :rules="[{ required: true, message: '请填写原密码' }]"
        />
        <van-field
          v-model="newpassword"
          :type="iswarning ? 'password' : 'text'"
          name="newpassword"
          label="新密码"
          :show-error="true"
          :right-icon="iswarning ? 'closed-eye' : 'eye-o'"
          @click-right-icon="iswarning = !iswarning"
          placeholder="请填写新密码"
          :rules="[{ required: true, message: '请填写新密码' }]"
        />
      </van-cell-group>
      <div style="margin: 16px">
        <van-button round block type="primary" native-type="submit">
          提交
        </van-button>
      </div>
    </van-form>
    <p
      style="
        float: right;
        padding-right: 20px;
        font-size: 14px;
        font-weight: bold;
      "
    >
      <span @click="resetpassword">重置密码</span>
    </p>
  </div>
</template>

<script>
import request from "@/utils/request";
import { showNotify } from "vant";
import { showConfirmDialog } from "vant";
export default {
  data() {
    return {
      password: "",
      newpassword: "",
      // 控制图标的显示与隐藏
      iswarning: true,
      niswarning: true,
    };
  },
  methods: {
    // 提交修改密码流程
    async onSubmit(values) {
      const id = localStorage.getItem("id");
      //   重构values
      const newvalues = {
        ...values,
        id: id,
      };
      const result = await request.post("/good/updatepwd", newvalues);
      if (result.data.code === 500) {
        showNotify({ type: "danger", message: result.data.message });
        this.password = "";
        this.newpassword = "";
      }
      if (result.data.code === 200) {
        showNotify({ type: "success", message: result.data.message });
        this.password = "";
        this.newpassword = "";
      }
    },
    // 重置密码
    resetpassword() {
      showConfirmDialog({
        message: "是否重置密码为初始密码123456",
      })
        .then(async () => {
          const id = localStorage.getItem("id");
          await request.get(`/good/resetpwd?id=${id}`);
          showNotify({ type: "success", message: "重置密码成功!" });
        })
        .catch(() => {
          console.log("点击取消");
        });
    },
  },
};
</script>

<style lang="scss">
.updatepwd {
  margin-top: 10px;
}
</style>
